/*tab*/
//= 标签tab:外容器;
.tabs-wrap {
  // background: url(images / unquote($main-repeat-bg)) repeat-x 0 -600px;
  border-bottom: 1px solid $main-border-color;

  @include clear(fix);
  // padding: 0 3px;

  .gridlist-action & {
    background: transparent;
  }

  ul {
    float: left;

    // margin: 3px 0 0 0;
    // padding: 0 5px;
  }

  li {
    // margin: 0 2px 0 0;
    @include height(32px);

    color: $main-text-color;
  }

  .current,
  .gridlist-action & li.current {
    // @include sliding($tab-wrap-bg);
    position: relative;
    top: 1px;
    font-weight: 400;
    color: $primary-text-color;
    border-bottom: 2px solid $main-color;
  }
}

//= 标签tab
.tab {
  float: left;
  padding: 0 0 0 17px;
  margin-right: 5px;
  font-size: 13px;
  line-height: 28px;
  color: #5f5f5f;
  text-align: center;
  list-style: none;
  cursor: pointer;
  background: none;

  .gridlist-action & {
    padding: 0 0 0 15px;
  }

  a,
  span {
    display: block;
    height: 28px;
    padding: 0 15px 0 0;
    white-space: nowrap;
  }

  a {
    color: $main-text-color;
    text-decoration: none;

    &:hover {
      text-decoration: none;
    }
  }

  .lnk {
    color: #3367ac;
    text-decoration: underline;
  }
}

//= 标签项目
.tabs-item {
  @include border(1px solid #C0D1D6, no-top);

  padding: 10px;
}

.section-title {
  font-weight: 400;
  line-height: 2;
  border-bottom: 1px solid $main-border-color;

  span {
    position: relative;
    top: 1px;
    display: inline-block;
    color: $primary-text-color;
    border-bottom: 2px solid $main-color;
  }
}

/*gift-tab*/
.gift-tab {
  position: relative;
  width: 100%;

  .switchable-triggerBox {
    li {
      float: left;
      width: 102px;
      padding: 0 0 0 7px;
      margin: 0 5px 0 0;
      font-size: 12px;
      color: $g3;
      text-align: center;
      cursor: pointer;
      background: #efefef;

      @include height(29px);
    }

    li span {

      display: block;
      // @include sliding($tag-bg, $offsetX: 100%);
      background: #efefef;

      @include height(29px);
    }

    li.cur {
      font-weight: bold;
      // @include sliding($tag-bg-on);
      background: #efefef;

      span {
        // @include sliding($tag-bg-on, $offsetX: 100%);
        background: #efefef;
      }
    }
  }

  .switchable-content {
    position: relative;
    height: 200px;
    padding: 0;
    overflow: hidden;
    clear: both;
    border: 1px solid $gd;
    border-top: none;

    .gift-title {
      height: 27px;
      padding: 5px 15px 0 15px;
      background: $ge;
    }

    .gift-title a {
      padding: 3px 5px;
      *padding: 5px;
      color: #3f4d69;
      text-decoration: none;
    }

    .gift-title a:hover {
      color: $g0;
    }
  }
}

.gift-tab .switchable-content li,
.have_selct li {
  position: relative;
  display: block;
  float: left;
  width: 62px;
  height: 62px;
  padding: 2px;
  margin: 5px 6px 5px 0;
  text-align: center;
  border: 1px solid $gc;
}

.have_selct {
  width: 707px;
  height: auto;
  clear: both;
}

.have_selct img,
.switchable-content img {
  height: 60px;
}

.gift-tab .switchable-content li del {
  visibility: hidden;
}

.goodsone li div {
  position: absolute;
  top: -2px;
  right: 0;
  width: 12px;
  height: 12px;

  // @include icon-bg(delete);
}

.gift-tab .switchable-content .goodsone {
  height: 100%;
  padding: 0 0 10px 0;
  border-top: 1px solid $gd;
}

.goods-list {
  position: relative;
  height: 160px;
  padding: 5px 10px;
  overflow-y: auto;
}

/*pager*/
//= 翻页
.pager {
  overflow: hidden;
  clear: both;
  font-family: Tahoma, Helvetica, sans-serif;
  font-size: $pager-text-size;
  text-align: center;

  a,
  span {
    display: inline-block;
    width: 28px;
    margin: 2px;
    text-decoration: none;
    cursor: pointer;
    border-right: 3px;

    @include height(28px);

    // @include border($pager-border);
    @include font($pager-text 16px, color size);
    @include background($pager-bg);

    &.num {
      font-size: 12px;
    }
  }

  a:hover,
  span:hover,
  .current {
    @include background($pager-active-bg);

    // @include border($pager-active-border);
    @include font($pager-active-text);
  }

  .disabled {
    // border-style: dotted;
    color: #dadadd;
    cursor: not-allowed;
  }

  span.disabled:hover {
    color: #dadada;
    background-color: #f3f3f3;
  }

  .span-auto {
    margin-right: 0;
  }

  .pagernum {
    overflow: hidden;
  }
}

/* the tips info */
//= 提示/帮助图标:外框;

.tip-wrap {
  position: absolute;
  z-index: 65535;
}

//= 提示/帮助tip-
.tip {
  min-width: 180px;
  max-width: 300px;
  padding-bottom: 3px;
  background: #ffffcc;
  border: 1px solid #cfdae2;

  @include border-radius(3px);
  @include box-shadow(1px 1px 1px rgba(201, 201, 201, 0.5));
}

.tip-top,
.tip-bottom {
  position: absolute;
  top: 8px;
  left: -13px;
  width: 0;
  height: 0;
  overflow: hidden;
  font-size: 0;
  border-color: transparent #cfdae2 transparent transparent;
  border-style: dashed solid dashed dashed;
  border-width: 7px;
}

.tip-bottom {
  left: -12px;
  border-right-color: #ffffcc;
}

.tip-top-right {
  right: -13px;
  left: auto;
  border-color: transparent transparent transparent #cfdae2;
  border-style: dashed dashed dashed solid;
}

.tip-bottom-right {
  right: -12px;
  left: auto;
  border-color: transparent transparent transparent #ffffcc;
  border-style: dashed dashed dashed solid;
}

.tip-title {
  padding: 0 3px 0 20px;
  font-weight: bold;
  line-height: 20px;
  background: #ffeaaa;
}

.tip-text {
  padding: 3px 7px;
  overflow: hidden;
  line-height: 16px;
  color: #5b5b5b;
  word-wrap: break-word;

  p {
    margin-bottom: 5px;
  }
}

//= finder中图像提示框
.finder-col-img-tip {
  z-index: 65535;

  .tip {
    background: $gf;
    border: 0;
    box-shadow: 0 0 20px rgba($g0, 0.1);

    img {
      display: block;
      margin: 0 auto;
      max-width: 100%;
    }
  }

  .tip-text {
    height: 200px;
    text-align: center;
    vertical-align: middle;
  }

  .tip-top,
  .tip-bottom {
    display: none;
  }
}

//= finder中文本提示
.finder-col-text-tip {
  z-index: 65535;

  .tip {
    width: 280px;
  }

  .tip-text {
    text-align: center;
    vertical-align: middle;
  }

  .tip-top,
  .tip-bottom {
    display: none;
  }
}

/* x view image */
//= 图像预览提示
.x-view-img {
  line-height: 15px;
  cursor: pointer;

  // @include icon-bg(view-img);

  border: 0 none !important;
}

.x-view-img:hover {
  // @include icon-bg(view-img, $offsetY: -24px, $pos: true);
}

/* tags */
//= 打标签x-tag
.x-tag-wrapper {
  padding: 0;
  margin: 5px 0;
}

.x-tag-info {
  float: left;
  width: 60px;
  padding: 6px 0;
  margin-right: 5px;
  font-weight: normal;
}

.x-tag-list {
  padding: 0;
  margin: 0;
}

.x-tag-list .x-tag {
  float: left;
  padding: 2px 5px;
  margin: 2px 4px 2px 0;
  white-space: nowrap;
  cursor: pointer;
  background: #f5f9ff;
  border: 1px solid $gf;
  border-color: $gf #a5c9f5 #a5c9f5 $gf;
}

.x-tag-list .x-tag-selected {
  color: $gf;
  background: #70acf4;
  border-color: #4b9fee;
}

/* tree list */
//= 目录树
.x-tree-list {
  .node {
    display: block;
    height: 27px;
    overflow: hidden;
    white-space: nowrap;
    zoom: 1;
  }

  .node span,
  .node input {
    display: block;
    float: left;
    margin-top: 0;
    margin-bottom: 0;
  }

  div {
    padding-left: 15px;
  }

  .node-hasc,
  .node-child-box {
    clear: both;
  }

  .node-line {
    display: none;
  }

  .node-icon {
    width: 20px;
    background: url(images/treeico.gif) no-repeat 50% -54px;
  }

  .node-hasc .node-icon {
    background-position: 50% -6px;
  }

  .node-name {
    padding-right: 10px;
    color: $g6;
  }

  .node-handle {
    width: 18px;
  }

  .node-hasc .node-handle {
    cursor: pointer;
    background: url(images/treeico.gif) no-repeat 50% -126px;
  }

  .node-hasc .node-close {
    background-position: 50% -107px;
  }
}

/* dialog */
//= 系统对话框
.dialog {
  position: absolute;

  @include box-shadow(0 0 7px rgba($g9, 0.5));

  .dialog-head {
    @if $dialog-img-theme == true {
      background: url(images/#{$dialog-head-bg}) 0 -500px;
    }

    @else {
      @include background($dialog-head-bg);
    }

    padding: 10px 20px;
    line-height: 20px;
    cursor: move;

    .dialog-title {
      font-size: $dialog-title-size;

      // padding: 0 8px;
      font-weight: 500;
      color: $dialog-title-color;
    }
  }

  .dialog-box {
    // @include border($dialog-border);
    @include background($dialog-bg);
  }

  .dialog-content-head,
  .dialog-content-foot {
    padding: 5px;
    line-height: 180%;
    color: #6b6b6b;
  }

  .dialog-content-head {
    padding: 0;

    @include background($dialog-content-head-bg);

    .tabs-wrap {
      height: 28px;
      padding-top: 3px;
      background-position: 0 -200px;
    }

    .tab,
    span {
      @include height(36px);
    }

    //.current { background:url(../../tab.gif) no-repeat 0 -234px; height:31px; }
    //.current span { background:url(../../tab.gif) no-repeat right -234px; }
  }

  .dialog-content-body {
    position: relative;
    padding: 10px;
    overflow: hidden;
    overflow-y: auto;
  }

  .dialog-content-foot {
    @include background($dialog-content-foot-bg);

    .table-action {
      position: relative;
      padding: 5px;
      margin: -5px;
      background-color: #fdfdfd;
      border-top: none;
    }
  }

  .tableform {
    border: none;

    // margin: 5px 10px 7px;
    // padding: 2px;
 
  }

  .tableform h4 {
    padding: 3px 2px;
    border: none;
  }

  .division {
    padding: 10px;
    background: $gf;
    border: 1px solid #efefef;
    border-radius: 5px;

    .division {
      border: none;
    }

    .leaf {
      margin-top: 5px;
      margin-bottom: 5px;
    }
  }

  .btn-close {
    // display: block;

    // @include icon-bg(btn_close);

    display: inline-block;
    width: 12px;
    height: 20px;
    color: $main-color;
    text-indent: -9999px;
    vertical-align: middle;
    cursor: pointer;
    background: url(images/btn-close.svg) no-repeat center;
    background-size: contain;
  }

  .table-action {
    padding-top: 10px;
    margin-top: 10px;
  }

  .btn-resize {
    // @include icon-bg(btn_resize);

    position: absolute;
    right: 2px;
    bottom: 2px;
    width: 6px;

    @include height(6px, 0);

    font-size: 0;
    cursor: se-resize;
    background: url(images/btn_resize.png) bottom right no-repeat;
  }
}

/* the validator */
//= 验证错误消息
.x-vali-error {
  display: inline;
  height: 25px;
  padding: 3px 5px 3px 21px;
  margin-left: 10px;
  color: #e6594e;
  text-align: left;
  white-space: nowrap;

  // @include icon-bg($valid-error-bg);

  background-color: $valid-error-bg;
  border: 1px solid $valid-error-color;
}

/*select*/
//= 选择属性值确定按钮
.selectbtn {
  height: 25px;
  color: $g3;
}

.select .on {
  font-weight: bold;
  color: $gf;
  background: #2d297a;
}

//= 商品类型选项
.optionlevels {
  border: none;
}

/* dropmenu */
//= 系统下拉菜单
.x-drop-menu {
  position: absolute;
  z-index: 999;
  display: none;
  line-height: 180%;
  white-space: nowrap;
  background: $gf;
  border: 1px solid $main-border-color;

  li {
    float: none;
    width: auto;
    padding: 3px 8px;
    cursor: pointer;

    &:hover {
      background: $ef;
      // border-radius: 3px;
    }
  }

  li.item {
    float: none;
    width: auto;
    margin: 0;
    padding: 3px 15px;
  }
}

/* category group */
//= 礼包－分类选择
.cat-group {
  a {
    display: block;
    padding: 2px 3px;
    font-size: 13px;
    text-decoration: none;
    border: 1px $gf solid;

    &:hover {
      background: #e9e9e9;
    }
  }

  .subs {
    width: 14px;
    text-indent: -999em;
    background: url(images/ico_arrow1.gif) center no-repeat;
    border: 1px $gf solid;

    &:hover {
      background: url(images/ico_arrow2.gif) center no-repeat;
      border: 1px solid $main-divider-color;
    }
  }
}

/* html editor */
//= html编辑器
.wysiwyg_body {
  border: 1px solid $main-border-color;

  iframe,
  textarea {
    width: 100%;
    height: 100%;
    padding: 0;
    margin: 0;
    clear: both;
    font-family: verdana, sans-serif;
    background: $gf;
    border: none;
  }
}

.mce_style_1 {
  margin: 0;
  overflow: hidden;
  clear: both;
  background-color: $main-bg-color;

  @include border($main-border-color, no-bottom);

  li,
  ul {
    list-style-type: none;
  }

  ul {
    height: 100%;
    padding: 4px;
    margin: 0;
    overflow: hidden;
    // border: 1px $gf solid;
    // border-right: none;
    // border-bottom: none;
  }

  li {
    float: left;
    padding: 2px;
    margin-right: 2px;
    cursor: pointer;
    border: none;
  }

  li img {
    float: left;
    margin: 0;
  }

  li:hover {
    padding: 1px;
    background: #c7dce7;
    border: 1px solid #688db2;
  }

  li.in {
    padding: 1px;
    background: $gf;
    border: 1px $gc solid;
  }

  select {
    font-family: Verdana, sans-serif;
    font-size: 10px;
    color: $g3;
  }

  select option {
    background: #f2fafc;
  }
}

.button-add,
.button-cut {
  @include height(16px);

  width: 16px;
  margin: 5px 5px 0 0;
  cursor: pointer;
  border: none;

  @include icon_bg($btn-add-cut-bg);
}

.button-cut {
  @include icon_bg($btn-add-cut-bg, $pos: true, $offsetY: -32px);
}

/* picture album */
//= 图片选择组件image-
.image-input {
  min-width: 60px;
  border: 1px solid $main-border-color;
  border-radius: 5px;

  .frt {
    margin-top: 3px;
  }
}

.image-input-view {
  text-align: center;
  vertical-align: middle;

  img {
    max-width: 100%;
    max-height: 100%;
  }
}

.image-input-handle {
  padding: 5px;
  line-height: normal;
  color: #666666;
  text-decoration: none;
  white-space: normal;

  // border: 1px $gc solid;
  cursor: pointer;
  background: #efefef;
  border-bottom-right-radius: 5px;
  border-bottom-left-radius: 5px;

  img {
    display: block;
    margin: 3px auto;
  }

  &:hover {
    color: $gf;
    background: $main-color;
  }
}

.image-broswer-handle {
  margin: 0 -7px;
}

.image-lib {
  img {
    padding: 1px;
    background-color: $gf;
    border: 2px solid $gf;
  }

  .item:hover img {
    border-color: #ff3300;
  }

  .item i {
    visibility: hidden;
  }

  .current i {
    visibility: visible;
  }

  .current img {
    background-color: $g3;
    border-color: $g9;
  }

  td {
    .dialog .division & {
      border: none;
    }
  }
}

/* calendar */
//= 日历组件x-calendar，x-datepicker
.x-calendar {
  user-select: none;
  border-radius: 3px;
  box-shadow: 0 0 20px rgba($g0, 0.15);
}

.x-datepicker {
  // width: 226px;
  overflow: hidden;
  background-color: $gf;
  border-radius: 3px;

  table {
    width: 100%;
    padding: 0;
    margin: 0 auto;
    overflow: hidden;
    // background-color: $main-bg-color;
    border-spacing: 0;
    border: 0 none;
  }

  caption {
    width: 100%;
    height: 50px;
    font-size: 14px;
    font-weight: 400;
    line-height: 50px;
    color: $gf;
    text-align: center;
    background-color: $main-color;
    // border-bottom: 1px solid $g0;

    a {
      margin: 0 10px;
      // font-weight: bold;
      color: $gf;
      text-decoration: none;
      cursor: pointer;
    }
  }

  .next,
  .prev {
    display: inline-block;
    width: 10px;
    height: 10px;
    vertical-align: middle;
    cursor: pointer;
    background: center/contain no-repeat;
  }

  .angle-double-left {
    background-image: url(images/angle-double-left.svg);
  }

  .angle-double-right {
    background-image: url(images/angle-double-right.svg);
  }

  .angle-left {
    background-image: url(images/angle-left.svg);
  }

  .angle-right {
    background-image: url(images/angle-right.svg);
  }

  th,
  td {
    width: 30px;
    height: 30px;
    font-size: 13px;
    text-align: center;
    cursor: default;
    // background: $gf;
    // border-top: 1px solid #bebebe;
  }

  th {
    font-size: 12px;
    color: $g8;
    // background-color: $gf;
    border: none;
  }

  // td {
  //   border-radius: 50%;
  // }

  .active {
    // color: $gf;
    // background-color: $gf;
    cursor: pointer;
  }

  .inactive {
    color: #bebebe;
    background-color: $main-bg-color;
  }

  .today {
    // background: #ffff99;
    color: $main-color;
    box-shadow: inset 0 0 0 1px rgba($main-color, 0.9);
  }

  .hilite {
    color: $gf;
    background: $main-color;
  }
}

.x-datepicker-month {
  width: 120px;
  padding-left: 10px;
}

.x-datepicker-year {
  width: 80px;
  padding-right: 10px;
}

.x-datepicker-year span,
.x-datepicker-month span {
  cursor: s-resize;
}

/* color picker */
//= 颜色选择器goog-palette-
.goog-palette-panel {
  position: absolute;
  z-index: 65535;
  padding: 0.5ex 0 0;
  margin: 0;
  color: $g3;
  white-space: nowrap;
  cursor: default;
  visibility: hidden;
  border-collapse: collapse;
  background-color: $gf;
  border-color: $gc #676767 #676767 $gc;
  border-style: solid;
  border-width: 1px;
  outline-width: medium;
  outline-style: none;
  outline-color: -moz-use-text-color;
}

.goog-palette {
  cursor: default;
  outline: none;
}

.goog-palette-table td,
.goog-palette-table th {
  padding: 0;
}

.goog-palette-table {
  width: auto;
  margin: 5px;
  border-collapse: collapse;
  border: 1px solid $g6;
}

.goog-palette-cell {
  width: 18px;
  height: 18px;
  margin: 0;
  text-align: center;
  vertical-align: middle;
  cursor: pointer;
  border: none;
}

.goog-palette-cell .goog-palette-colorswatch {
  position: relative;
  width: 18px;
  height: 18px;
  font-size: x-small;
}

.goog-palette-cell-hover .goog-palette-colorswatch {
  width: 16px;
  height: 16px;
  border: 1px solid $gf;
}

/*inputfile*/
//= 文件上传/导入框
.input-file {
  @include inline-block;
}

.input-file-selected {
  width: auto !important;
  width: 100px;
  min-width: 100px;
  padding: 0 5px;
  border-bottom: 1px solid $gc;

  @include inline-block;
}

/* tag editor */
//= 标签编辑
ul.tag-editor-group {
  padding: 6px 3px;
  margin: 0 5px 5px;

  li {
    *padding: 2px 0;
    cursor: pointer;
  }
}

.tag-editor-group li {
  list-style: none;
}

// span.tag {
//   padding: 1px 2px;
//   margin: 0 1px;
//   background: #f8f8f8;
//   border: 1px solid #B7C2CF;
// }

.tag-label {
  padding: 2px 4px;
  margin-right: 3px;
  color: #4e6a81;
  background: #f1f4f7;

  @include border-radius(4px);
}

/* msgbox */
//= 顶部提示条
.msgbox {
  position: fixed;
  top: 0;
  right: 40%;
  left: 40%;
  z-index: 65535;
  padding: 0 20px;
  overflow: visible;
  font-size: 14px;
  line-height: 48px;
  color: $msgbox-text-color;
  text-align: center;
  word-wrap: break-word;
  white-space: normal;
  background: $msgbox-bg-color;
  border: 1px solid $msgbox-bd-color;
  border-top-width: 0;
  border-bottom-right-radius: 2px;
  border-bottom-left-radius: 2px;
  transition: all 0.3s ease-in-out;
  transform: translateY(-100%);

  // line-height: 29px;
  @include box-shadow(0 0 5px rgba(black, 0.05));

  a {
    font-weight: normal;
    color: #eb7d00;
    text-decoration: underline;
  }

  &.warning {
    background: $msgbox-warn-bg-color;
    border-color: $msgbox-warn-bd-color;
  }

  &.exception {
    background: $msgbox-exc-bg-color;
    border-color: $msgbox-exc-bd-color;
  }

  &.default,
  &.warning,
  &.exception {
    display: block !important;
    visibility: visible !important;
    transform: translateY(0);
  }
}

.message {
  position: absolute;
  top: 50%;
  left: 50%;
  max-width: 350px;
  padding: 10px;
  line-height: 2.2;
  color: $gf;
  visibility: hidden;
  background-color: #3fd458;
  border: 1px solid #29bf42;
}

.message-success {
  padding-left: 26px;
  visibility: visible;

  &:after {
    position: absolute;
    top: 10px;
    left: 10px;
    width: 16px;
    height: 26px;
    content: '\2713';
  }
}

/*imgbundle*/
//= 图片打包
.imgbundle {
  margin-right: 2px;
  background-image: url(images/bundle.gif);
  background-repeat: no-repeat;
}

/*行业体验数据*/
//= 行业体验数据
.text-spec-value-table .simg-col span {
  visibility: hidden;
}

/*筛选器*/
//= 筛选器
.selector-panel {
  width: 532px;
  overflow: hidden;
}

.selector-table {
  table-layout: fixed;
}

.selector-table tbody td {
  padding: 0;
  text-align: left;
  vertical-align: top;
}

/*跳转提示器*/
//= 跳转提示器
.splash {
  position: static;
  width: 400px;
  padding: 10px;
  margin: 20px auto 0 auto;
  border-width: 2px;
}

//= 选择组件
.object-select {
  margin: 2px 0;

  @include inline-block(middle);

  background-color: $ge;
  border-radius: 3px;

  div {
    float: left;

    @include height(35px);
  }

  .label {
    padding: 0 10px 0 10px;
    font-weight: normal;
    cursor: pointer;
    border-right: none;

    @include text-overflow(280px max);
  }

  .handle {
    width: 25px;
    cursor: pointer;

    // @include sliding(select, $offsetX: 100%, $offsetY: -30px);
    background: url(images/arrow.svg) no-repeat center;
  }
}

/*框架loading*/
//= 框架loading
.loadpart {
  padding: 5px;

  .msg {
    padding: 4px;
    font-weight: bold;
  }
}

//= 水印
.watermark-setting .tableform {
  padding: 0 10px 5px;
  margin: 3px 0;
  background: #f8f8f8;
  border: 1px solid #d8d8d8;
}

.watermark-none .watermark-setting {
  display: none;
}

.watermark-none .pos-select,
.watermark-none .watermark-set,
.watermark-text .watermark-image-set,
.watermark-image .watermark-text-set {
  display: none;
}

/*商品评论综合评分*/
//= 商品评论综合评分
.star-div,
.point-div {
  height: 19px;
  padding: 2px 2px 0 0;
  padding: 0 2px 0 0\9;
}

.star-div ul,
.point-div {
  padding: 0;
  margin: 0;
  list-style-type: none;
}

.point-div li {
  float: left;
  width: 75px;
  height: 19px;
  padding: 0;
  margin: 0 14px 0 0;
  line-height: 19px;
  text-align: center;
}

.star-div {
  li {
    float: left;
    width: 75px;
    padding: 0;
    margin: 0 14px 0 0;

    @include height(19px, 12px, false, 19px, "*");
  }

  .star0,
  .star {
    visibility: hidden;
  }

  @for $i from 1 through 5 {
    .star#{$i} {
      background: url(images/star#{$i}.png) 0 0 no-repeat;
    }

    .star#{$i}_ {
      background: url(images/star#{$i}_.png) 0 0 no-repeat;
    }
  }
}

/* goods spec */
//= 商品规格值
.goods-spec-pic {
  padding: 1px;
  vertical-align: middle;
  border: 1px solid #3366cc;
}

.goods-spec-box {
  overflow: hidden;
  background: $gf;

  li {
    float: left;
    margin: 3px;
    cursor: pointer;
    border: 2px $gf solid;
  }

  span,
  img {
    display: block;
    padding: 1px;
    color: $g3;
    background: $gf;
    border: 1px #3366cc solid;
  }

  span {
    padding: 1px 4px 1px 4px;
    white-space: nowrap;
  }

  .spec-add,
  .spec-add label {
    padding: 0;
    margin: 0;
    line-height: normal;
    text-align: center;
    cursor: pointer;
    border: none;
  }
}

.goods-spec-span {
  padding: 1px 4px;
  border: 1px solid #336699;
}

//= 商品规格
#goods-spec {
  .goods-spec-box {
    padding: 4px;
    margin: 0;
    border: 1px #3366cc solid;

    li {
      cursor: pointer;
    }

    .noclick {
      color: $gc;
      cursor: not-allowed;

      span,
      img {
        color: $gc;

        @include opacity(0.5);
      }
    }
  }

  .select-spec-unselect,
  .select-spec-value {
    display: block;
    background: $gf;
    border: 2px $gf solid;
  }

  .select-spec-unselect span,
  .select-spec-unselect img {
    display: block;
    padding: 1px;
    color: $g3;
    cursor: pointer;
    background: $gf;
    border: 1px #3366cc dotted;
  }

  .goods-spec-select span,
  .goods-spec-select img {
    border-style: solid;
  }

  .goods-spec-selected span,
  .goods-spec-selected img {
    background: $ffc;
    border-style: solid;
  }
}

/* category_filter */
//= 商品分类选择组件 category_filter goods_category_body cat_sel_wrap cat_select ipt_search cat_catpath cat_catpath_info
.category_filter {
  position: relative;
  width: 100%;
  padding: 4px 0;
  overflow: hidden;
  overflow-x: auto;
}

.goods_category_body {
  height: 280px;
}

.cat_sel_wrap select {
  width: 78%;
}

.cat_sel_wrap strong {
  @include height(24px);
}

.cat_select {
  .goods_category_body & {
    position: relative;
    float: left;
    width: 200px;
    height: 100%;
    margin: 0;
    margin-right: 5px;
    overflow-x: hidden;
    overflow-y: auto;
    list-style: none outside none;
    background: $gf;
    background: #eaeef4;
    border: 1px solid #d5dfe3;
  }

  li {
    position: relative;
    padding: 2px 5px;
    padding-right: 2px;
    margin: 2px 0;
    cursor: pointer;
  }

  .isParent .icon {
    visibility: visible;
  }

  .icon {
    position: absolute;
    right: 4px;
    width: 0;
    height: 0;
    margin-top: 4px;
    font-size: 0;
    visibility: hidden;
    border-color: transparent transparent transparent $g6;
    border-style: solid;
    border-width: 4px;
  }

  li.cur {
    padding: 1px 5px;
    margin: 2px 0;
    color: $gf;
    background-color: #6e8ecd;
    border-top: 1px solid #91aed9;
    border-bottom: 1px solid #91aed9;
  }

  li.cur .icon {
    border-color: transparent transparent transparent $gf;
  }

  .filter_item {
    padding-left: 0;
  }
}

.ipt_search {
  width: 168px;
  padding: 0 0 2px 4px;
  margin-left: 4px;
  color: $g9;
  border-color: #b0b9bc #d5dfe3 #d5dfe3 #b0b9bc;
  border-style: solid;
  border-width: 1px;

  @include height(20px);
  @include border-radius(2px);
}

.cat_catpath {
  padding-top: 0;
  margin: 2px 0;
  background: $gf;
  border: 1px solid #d5dfe3;
}

.cat_catpath_info {
  padding: 9px 7px;
  color: $g4;
  background: $gf;
}

/*favorite star*/
//= 收藏fav-star-
.fav-star {
  position: relative;
  display: block;
  width: 15px;
  height: 23px;
  padding: 0;
  margin: 0;
  overflow: hidden;
  line-height: 23px;
  cursor: pointer;
  zoom: 1;
  border: none;

  img {
    position: absolute;
    top: 4px;
    left: 0;
  }
}

.fav-star-on img {
  left: -20px;
}

/*note pop*/
//= 气泡提示
.note-pop {
  position: absolute;
  z-index: 7000;
  padding: 10px 10px 3px;
  color: $g6;
  background-color: #fff2df;
  border: 1px solid #ff9d12;

  @include box-shadow(2px 2px 2px rgba(217, 112, 10, 0.4));
  @include border-radius(3px);

  .close-box {
    padding-top: 3px;
    font-size: 12px;
    text-align: right;
  }

  .close {
    color: #ff8400;
    text-align: center;
    cursor: pointer;
  }

  .pop-ar {
    position: absolute;

    span {
      position: absolute;
    }

    &.bottom {
      span {
        top: -5px;
        left: -3px;
        border: 3px solid transparent;
        border-top: 3px solid #fff2df;
      }
      bottom: -10px;

      border: 5px solid transparent;
      border-top: 5px solid #ff9d12;
    }

    &.top {
      span {
        bottom: -5px;
        left: -3px;
        border: 3px solid transparent;
        border-bottom: 3px solid #fff2df;
      }
      top: -10px;

      border: 5px solid transparent;
      border-bottom: 5px solid #ff9d12;
    }
  }
}
